<template>
<div>
  <h1>新闻添加</h1>
  <p>标题内容<input type="text" v-model="form.bt"></p>
  <p>详情描述
    <textarea name="" id="" cols="30" rows="10" v-model="form.text"></textarea>
  </p>
  <button @click="add_nuws">添加</button>


  <h1>广告添加</h1>
  <p>添加图片<input type="file" id="img"></p>
  <p>输入跳转网址<input type="text" v-model="domain"></p>
  <button @click="add_Advertising">添加</button>

  <div>
    <ul>
      <li>新闻快讯</li>
    </ul>
    <ul v-for="i in nuws">
      <li>
        <router-link :to="{path:'nuws_xq',query:{id:i.id}}">{{i.bt}}</router-link>
      </li>
    </ul>
    <button @click="show_nuws(i)" v-for="i in num">{{i}}</button>
  </div>
  <div>
    <p v-for="i in adv">
      <a :href="i.domain" >
      <img :src="'http://127.0.0.1:8000'+i.pic" alt="" width="300px">
      </a>
    </p>
    <button v-for="i in num_adv" @click="show_Advertising(i)">{{i}}</button>
  </div>

</div>
</template>

<script>
export default {
  name: "nuws",
  data(){
    return{
      form:{},
      num : "",
      nuws:[],
      adv:[],
      num_adv:"",
      domain : ""
    }
  },
  methods:{
    add_nuws(){
      this.$axios.post('users/Nuws_API/',this.form)
      .then(i=>{
        alert(i.data.code)
        this.show_nuws()
        this.form = {}
      })
    },

    show_nuws(i){
      this.$axios.get("users/Nuws_API/?cpage="+i)
      .then(i=>{
        this.nuws = i.data.list
        this.num = i.data.num
      })
    },

    add_Advertising(){
      let pic = document.getElementById("img").files[0]
      let form = new FormData()
      form.append("pic",pic)
      form.append('domain',this.domain)
      this.$axios.post('users/Advertising_API/',form)
      .then(i=>{
        alert(i.data.code)
      })
    },
    show_Advertising(i){
      this.$axios.get("users/Advertising_API/?cpage="+i)
      .then(i=>{
        this.adv = i.data.list
        this.num_adv = i.data.num
      })
    },
    adv_t(){
      this.$router.push('show_adv')
    }
  },
  mounted() {
    this.show_nuws(1)
    this.show_Advertising(1)
  }
}
</script>

<style scoped>

</style>
